<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>运输外包登记</title>
    <link rel="stylesheet" type="text/css" href="../../../../start/layui/css/layui.css"/>

    <style type="text/css">
        .layui-form-select .layui-input {
            padding-right: 0px;
            cursor: pointer;
        }
    </style>
    <script src="../../../../start/layui/layui.js"></script>
    <script type="text/javascript" src="../../../../start/layui/js/area2.js"></script>
    <script type="text/javascript" src="../../../../start/layui/js/xcl.js"></script>

</head>
<body>
<form class="layui-form">
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md4">
            <label class="layui-form-label">承担公司</label>
            <div class="layui-input-inline selectTitleDiv" id="search-form0">
                <input type="tel" name="ownerName"     id="textValue0"  autocomplete="off" class="layui-input textValue">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">电话</label>
            <div class="layui-input-inline">
                <input type="tel" autocomplete="off" id="phone" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">联系人</label>
            <div class="layui-input-inline">
                <input type="tel"  autocomplete="off" id="name" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md8">
            <div class="layui-form-item">
                <label class="layui-form-label">请选择地区</label>
                <div class="layui-inline">
                    <select name="province" id="province1" class="province"  lay-search lay-filter="province">
                        <option value="">省份</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <select name="city" id="city1"     class="city"  lay-search lay-filter="city">
                        <option value="">地级市</option>
                    </select>
                </div>
                <div class="layui-inline">
                    <select name="district" id="district1" lay-filter="district" class="district"  lay-search>
                        <option value="">县/区</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-col-md4">
            <div class="layui-inline">
                <label class="layui-form-label"  style="padding-left: 0px;width: 95px">地址</label>
                <div class="layui-input-inline">
                    <input type="tel" name="detailedAddress1"  required id="detailedAddress1" autocomplete="on" class="layui-input" lay-verify="required">
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-md4">
            <label class="layui-form-label">运单号</label>
            <div class="layui-input-inline">
                <input type="tel" disabled="disabled" id="waybill_id" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">到达城市</label>
            <div class="layui-input-inline">
                <input type="tel" disabled="disabled" id="arrivalCity" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">货物名称</label>
            <div class="layui-input-inline">
                <input type="tel" disabled="disabled" id="descriptionGoods" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md4">
            <label class="layui-form-label">货物重量</label>
            <div class="layui-input-inline">
                <input type="tel" disabled="disabled" id="weight"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">货物体积</label>
            <div class="layui-input-inline">
                <input type="tel" disabled="disabled" id="volume"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">外包单号</label>
            <div class="layui-input-inline">
                <input type="tel"  id="outsourcingorder" lay-verify="required"  autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md4">
            <label class="layui-form-label">外包运费</label>
            <div class="layui-input-inline">
                <input type="tel"  id="freight"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">外包应收</label>
            <div class="layui-input-inline">
                <input type="tel"  id="outsourcingNowclosed"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">支付方式</label>
            <div class="layui-input-inline">
                <select id="modepayment">
                    <option value="1">现金</option>
                    <option value="2">微信</option>
                    <option value="3">支付宝</option>
                    <option value="4">刷卡</option>
                </select>
            </div>
        </div>
    </div>
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md4">
            <label class="layui-form-label">外包现收</label>
            <div class="layui-input-inline">
                <input type="tel"  id="recycle"  autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-col-md4">
            <label class="layui-form-label">转包日期</label>
            <div class="layui-input-inline">
                <input type="date"  id="subcontractdate"  autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-row" style="padding-top: 10px">
        <div class="layui-col-md4">
            <label class="layui-form-label">备注</label>
            <div class="layui-input-inline">
                <textarea name="desc" placeholder="请输入内容" class="layui-textarea" id="remark"></textarea>
            </div>
        </div>
        <label class="layui-form-label">&nbsp;</label>
        <div class="layui-input-inline">
            <button class="layui-btn" type="button" lay-submit lay-filter="formDemo">立即提交</button>
        </div>
    </div>
</form>
</body>
</html>
<script>
    layui.use(['form','jquery'], function() {
        var form = layui.form
        var $ = layui.jquery;


        //显示网址
        var locationi=location.href;
        //根据下标截取字符串获得id
        var id=locationi.substring(locationi.indexOf("=")+1);
        $.ajax({
            url: "../../../../XclBreakmajorityEpibolyControllerGetBreakmajorityEpibolyById",
            type: "post",
            data: {
                id:id
            },
            dataType: "json",
            success: function (data) {
                //赋值
                $('#waybill_id').val(data.waybill_id)
                $('#arrivalCity').val(data.arrivalCity)
                $('#descriptionGoods').val(data.descriptionGoods)
                $('#weight').val(data.weight);
                $('#volume').val(data.volume)
            }
        })

        //用于存储查询地址
        var selectAll = ['XclBreakmajorityEpibolyControllerGetAllConsignerByPhone'];
        //用于得到当前需要增加的下拉列表提示下标
        var indexDate = 0;
        $(".selectTitleDiv").each(function (i, z) {
            //查询需要存放的标签值
            $.ajax({
                url: "../../../../"+selectAll[i],
                type: 'post',
                success: function (data) {
                    //当前需要增加的下拉列表下标
                    indexDate = data.index;
                    //增加下拉列表提示
                    $(document).ready(function () {
                        //增加下拉列表提示
                        $("#search-form" + data.index).autocomplete({
                            hints: data.data,
                            width: 300,
                            height: 30
                        });
                    });
                }
            })
        })

        //绑定文本框失焦事件 用于隐藏下拉提示
        $('.textValue').blur(function () {
            //增加延时器防止点击的时候隐藏
            setTimeout(function () {
                $(".proposal-box").css("display", "none")
            }, 200);

        })
        //绑定文本框更改事件 用于显示隐藏的下拉提示
        $('.textValue').keyup(function () {
            //alert($('.textValue').index(this));
            $("#search-form" + $('.textValue').index(this) + " .proposal-box").css("display", "block")
        })
        //用于下拉列表提示
        $.fn.autocomplete = function (params) {
            //Selections
            var currentSelection = -1;
            var currentProposals = [];
            //Default parameters
            params = $.extend({
                hints: [],
                placeholder: 'Search',
                width: 168,
                height: 16,
                showButton: true,
                buttonText: 'Search',
                onSubmit: function (text) {
                },
                onBlur: function () {
                }
            }, params);
            var searchContainer = $("#search-form" + indexDate)
            //Text input
            var input = $("#textValue" + indexDate);
            //Proposals
            var proposals = $('<div style=" z-index:999"></div>')
                .addClass('proposal-box')
                .css('width', 186)
                .css('top', 30);
            var proposalList = $('<ul></ul>')
                .addClass('proposal-list');

            proposals.append(proposalList);

            input.keydown(function (e) {
                switch (e.which) {
                    case 38: // Up arrow
                        e.preventDefault();
                        $('ul.proposal-list li').removeClass('selected');
                        if ((currentSelection - 1) >= 0) {
                            currentSelection--;
                            $("ul.proposal-list li:eq(" + currentSelection + ")")
                                .addClass('selected');
                        } else {
                            currentSelection = -1;
                        }
                        break;
                    case 40: // Down arrow
                        e.preventDefault();
                        if ((currentSelection + 1) < currentProposals.length) {
                            $('ul.proposal-list li').removeClass('selected');
                            currentSelection++;
                            $("ul.proposal-list li:eq(" + currentSelection + ")")
                                .addClass('selected');
                        }
                        break;
                    case 13: // Enter
                        if (currentSelection > -1) {
                            var text = $("ul.proposal-list li:eq(" + currentSelection + ")").html();
                            input.val(text);
                        }
                        currentSelection = -1;
                        proposalList.empty();
                        params.onSubmit(input.val());
                        break;
                    case 27: // Esc button
                        currentSelection = -1;
                        proposalList.empty();
                        input.val('');
                        break;
                }
            });
            //keyup事件最后发生，一次键盘敲入事件彻底完成。
            input.bind("keyup", function (e) {
                if (e.which != 13 && e.which != 27
                    && e.which != 38 && e.which != 40) {
                    currentProposals = [];
                    currentSelection = -1;
                    proposalList.empty();
                    if (input.val() != '') {
                        var word = "^" + input.val() + ".*";
                        proposalList.empty();
                        for (var test in params.hints) {
                            if (params.hints[test].match(word)) {
                                currentProposals.push(params.hints[test]);
                                var element = $('<li></li>')
                                    .html(params.hints[test])
                                    .addClass('proposal')
                                    .click(function () {
                                        proposalList.empty();
                                        params.onSubmit(input.val());
                                       $.ajax({
                                            url: "../../../../XclBreakmajorityEpibolyControllerGetLogisticsById",
                                            type: 'post',
                                            data: {
                                                'id': $(this).html().substring($(this).html().indexOf('号') + 1, $(this).html().length - 1)
                                            },
                                            async: false,
                                            success: function (data) {
                                                //物流承担商姓名
                                                $('#textValue0').val(data.forwardingunit)
                                                //地址
                                                $('#detailedAddress1').val(data.remark)
                                                //电话号码
                                                $('#phone').val(data.phone)
                                                //名称
                                                $('#name').val(data.name)
                                            }
                                        })
                                    })
                                    .mouseenter(function () {
                                        $(this).addClass('selected');
                                    })
                                    .mouseleave(function () {
                                        $(this).removeClass('selected');
                                    });
                                proposalList.append(element);
                            }
                        }
                    }
                }
            });
            searchContainer.append(proposals);
            //手动渲染
            form.render();
            return this;
        };

        //离开焦点判断有没有
        $('#outsourcingorder').blur(function(){
            $.ajax({
                url: "../../../../XclBreakmajorityEpibolyControllerGetOutsourcingByOutsourcingOrder",
                type: "post",
                data: {
                    outsourcingOrder: $('#outsourcingorder').val()
                },
                dataType: "json",
                success: function (data) {
                   if(data.outsourcingorder==$('#outsourcingorder').val()){
                       $('#outsourcingorder').val("")
                       alert("外包单号已存在请更换外包单号")
                   }
                }
            })
        })




        //提交
        form.on('submit(formDemo)', function(data){
            $.ajax({
                url: "../../../../XclBreakmajorityEpibolyControllerInsertElseRpiboly",
                type: "post",
                data: {
                    //物流承担商
                    phone: $('#phone').val(),
                    name: $('#name').val(),
                    remark: $('#detailedAddress1').val(),
                    forwardingunit: $('#textValue0').val(),
                    //地址
                    location:$('#detailedAddress1').val(),
                    //外包信息
                    freight:$('#freight').val(),
                    outsourcingorder: $('#outsourcingorder').val(),
                    outsourcingNowclosed:$('#outsourcingNowclosed').val(),
                    modepayment:$('#modepayment option:selected').val(),
                    recycle:$('#recycle').val(),
                    subcontractdate:$('#subcontractdate').val(),
                    remark:$('#remark').val(),
                    type:"运输外包",
                    id:id
                },
                dataType: "text",
                success: function (data) {
                    var index = parent.layer.getFrameIndex(window.name); //先得到当前iframe层的索引
                    parent.layer.close(index); //再执行关闭
                    layer.closeAll("iframe");//关闭iframe层
                    //修改成功后刷新父界面
                    window.parent.location.reload();
                }
            })

            return false;
        })

    })
</script>